$(function () {
    // 监听自动播放音乐
    (function () {
        var audio = document.querySelector('audio');
        document.addEventListener('WeixinJSBridgeReady',function () {
            audio.play();
        },false)

        // 音乐控制
        $('.music').click(function(){
            if(audio!==null) {
                if(audio.paused){
                    audio.play();
                    $('.music').addClass('on');
                }else{
                    audio.pause();
                    $('.music').removeClass('on');
                }
            }
        });

    })()
})


var app = new Vue({
    el : '#body',
    data (){
        return {
            id : $config.GetQueryString('id') || '',
            page : $config.GetQueryString('id')?5:1,
            isSelf : false,
            datas : '',
            sex : '',
            sexlist : '',
            model_id : '',
            isSexChange : false,
            info : '',
            shareCover : false,
            msgTitle : '',
            imgs : [{
                loaded: true
            }],
            share : {
                title : '梁羽生的英雄帖',
                cont : '蒙山论剑英雄帖，点击应战！',
                logo : 'http://h5.oeeee.com/h5/v18/literary-award/static/src/img/face/share.jpg'
            }
        }
    },
    created(){
        if(this.page==1){
            this.getData();
        }else{
            this.getInfo();
        }
        $config.wxShare(this.share);
    },
    mounted(){

    },
    methods : {
        //跳转页面
        toPage (page){
            this.page = page;
        },
        // 获取页面数据
        getData (){
            this.common().http(this, {
                url: '/LysYxt/getSlogenData',
                success(json) {
                    this.datas = json.data;
                    this.setSex('men');
                }
            })
        },
        //设置男女
        setSex (type){
            if(type=='men'){
                this.sexlist = [].concat(this.datas[0])
            }else if((type=='women')){
                this.isSexChange = true
                this.sexlist = [].concat(this.datas[1])
            }
            this.sex = type
        },
        //选择性格
        choiceNature (index){
            this.sexlist.forEach((item,key)=> {
                if(index==key){
                    item.choice = true
                    this.model_id = item.id
                }else{
                    item.choice = false
                }
                this.sexlist.splice(key,1,item)
            })
        },
        //微信选择图片
        chooseImage() {
            if (!this.imgs[0].loaded) return;
            var _this = this,
                crrunt = 0,
                total,
                localIds,
                uploadImage = () => {
                    wx.uploadImage({
                        localId: localIds[crrunt], // 需要上传的图片的本地ID，由chooseImage接口获得
                        isShowProgressTips: 0, // 默认为1，显示进度提示
                        success: function (res) {
                            var serverId = res.serverId; // 返回图片的服务器端ID
                            _this.wxUploadImg(localIds[crrunt], serverId);
                            crrunt++;
                            if (crrunt < total) {
                                uploadImage()
                            }

                        }
                    });
                };
            wx.chooseImage({
                count: 1, // 默认9
                sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
                sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
                success: function (res) {
                    localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
                    total = localIds.length;
                    _this.imgs.splice(0,1,{
                        url: localIds[crrunt],
                        loaded: false
                    })
                    uploadImage();
                }
            });
        },
        //微信上传图片
        wxUploadImg(lid, sid) {
            this.$http.post('http://h5.oeeee.com/index.php?s=/LysYxt/upload_pic_wx', {
                localId: lid,
                media_id: sid
            }).then(res => {
                var json = res.body;
                if(json.code==1){
                    this.imgs[0].filesrc = json.data.filesrc;
                    this.imgs[0].url = 'http://h5.oeeee.com'+json.data.filesrc;
                }else{
                    this._tipBox('识别不到人脸！')
                }
                this.imgs[0].loaded = true;
            });
        },
        //人脸合成
        faceCompound (){
            this.common().http(this, {
                lock : true,
                url: '/LysYxt/add',
                body : {
                    model_id : this.model_id,
                    picture : this.imgs[0].filesrc
                },
                success(json) {
                    this.id = json.data.id;
                    //显示分享按钮
                    this.isSelf = true;
                    //获取生成数据
                    this.getInfo();
                    this.toPage(5);
                    this.share.url = `${location.href}?id=${this.id}`
                    $config.wxShare(this.share);
                }
            })
        },
        //获取合成之后的信息
        getInfo (){
            this.common().http(this, {
                url: '/LysYxt/getShareData',
                body : {
                    id : this.id
                },
                success(json) {
                    this.info = json.data
                }
            })
        },
        //显示分享提示
        _shareCover(boole){
            this.shareCover = boole?true:false
        },
        //显示提示框
        _tipBox(text){
            this.msgTitle = text?text:false
        }
    },
    computed : {
        //是否可以跳转到第四页
        isCanToPage4 (){
            if(this.sexlist){
                let boole = false
                this.sexlist.forEach((item)=>{
                    if(item.choice){
                        boole = true
                    }
                })
                return boole
            }else{
                return false
            }
        },
        //是否可以合成人脸
        isCanCompound (){
            let img = this.imgs[0]
            if(img.loaded && img.filesrc){
                return true
            }else{
                return false
            }
        }
    }
})